function Swiper(el, options) {
    this.el = document.querySelector(el) //公共属性
    this.num = 1
    this.t = null
    this.options = options
    this.ulLi = this.el.querySelectorAll('ul li') //获取li标签方便后续使用
    this.img1 = this.el.querySelector('img') //获取img标签方便后续使用
    this.init() //初始化操作，让相关的元素绑定事件
}
Swiper.prototype.init = function() {
    this.defaultConfig();
    this.autoImg(); //给开关加方法
    this.yq();
    this.yqOverOut();
    this.imgStop();
    console.log(this);

}
Swiper.prototype.defaultConfig = function() {
    this.ulLi.forEach((item) => {
        item.style.background = this.options.pifu
    })
}
Swiper.prototype.autoImg = function() {
    this.t = setInterval(() => {
        this.num++
            if (this.num > 6) this.num = 1
        this.img1.src = `./image/img${this.num}.jpg`
        this.yq()
    }, 500)
}
Swiper.prototype.yq = function() {
    // let ulLi = this.el.querySelectorAll('ul li')
    this.ulLi.forEach((item) => {
        item.className = ""
    })
    this.ulLi[this.num - 1].className = 'active'
}
Swiper.prototype.yqOverOut = function() {
    // let ulLi = this.el.querySelectorAll('ul li')
    this.ulLi.forEach((item, index) => {
        item.onmouseover = () => {
            clearInterval(this.t)
            this.el.querySelector('ul li.active').className = ''
            this.img1.src = `./image/img${index+1}.jpg`;
            this.ulLi[index].className = 'active'
        }
        item.onmouseout = () => {
            this.autoImg();
            this.num = index + 1
        }
    })
    Swiper.prototype.imgStop = function() {
        // let img1 = this.el.querySelector('img')
        this.img1.onmouseover = () => {
            clearInterval(this.t)
        }
        this.img1.onmouseout = () => {
            this.autoImg()
        }
    }

}